<template>
     <view>
         <view class="content">
			 <view class="uni-padding-wrap uni-common-mt">
			 				<uni-segmented-control :current="current" color="#ffffff" :values="items" style-type="text"
			 					active-color="#ffdd00" @clickItem="onClickItem" />
			 			</view>
						<view class="line" style="clear:both;margin-top:20rpx;"></view>
			 			<view class="content">
			 				<!-- <view v-if="current === 0"><text class="content-text">选项卡1的内容</text></view>
			 				<view v-if="current === 1"><text class="content-text">选项卡2的内容</text></view>
			 				<view v-if="current === 2"><text class="content-text">选项卡3的内容</text></view> -->
							
							<view  v-for="(item,index) in news" :key="item.ID" @click="Jump('../skill/content',item)">
								<view style="margin-left: 20rpx;margin-top:20rpx;display: flex;">
									<view class="list-left">
										 <image :src="api.getUrl('/'+item.ShowPicture)" style="width:250rpx;height: 150rpx;" alt=""></image> 
									</view>
									<view class="list-right">
										<view style="color:white;height: 100rpx;">
											{{item.Title}}
										</view>
										<view>
											<uni-icons type="eye-filled" style="color: #949494; margin-left: 5px;" size="15"></uni-icons><label class="subtxt">{{item.ShowCount}}</label>
											<label style="margin-left:10px;" class="subtxt">{{item.EditTime.substring(0,10)}}</label>
										</view>
										
									</view>
								</view>
								<view class="line" style="clear:both;margin-top:20rpx"></view>
							</view>
							<!-- <view style="margin-left: 20rpx;margin-top:20rpx;display: flex;">
								<view class="list-left">
									 <image :src="api.getUrl('/images/banner-wx.jpg')" style="width:250rpx;height: 70px;" alt=""></image> 
								</view>
								<view class="list-right">
									<view style="color:white">
										VegaAI野生代言人
									</view>
									<view style="margin-top:60rpx; ">
										<uni-icons type="eye-filled" size="15"></uni-icons><label class="subtxt">1000</label>
										<label style="margin-left:10px;" class="subtxt">2023-09-25</label>
									</view>
									
								</view>
							</view>
							<view class="line" style="clear:both;margin-top:20rpx"></view>
							
							
							<view style="margin-left: 20rpx;margin-top:20rpx;display: flex;">
								<view class="list-left">
									 <image :src="api.getUrl('/images/banner-wx.jpg')" style="width:250rpx;height: 70px;" alt=""></image> 
								</view>
								<view class="list-right">
									<view style="color:white;margin-top:10rpx;">
										VegaAI野生代言人
									</view>
									<view style="margin-top:60rpx; ">
										<uni-icons type="eye-filled" size="15"></uni-icons><label class="subtxt">1000</label>
										<label style="margin-left:10px;" class="subtxt">2023-09-25</label>
									</view>
									
								</view>
							</view>
							<view class="line" style="clear:both;margin-top:20rpx"></view>
							 -->
							
							 <uni-load-more :status="status" :icon-size="16" :content-text="contentText" />
							
			 			</view>
		 </view>
        
		 
		 
     </view>
 </template>

<script>
import api from '@/common/api'
export default {
	data() {
		return {
			parameter:{page:1,pagesize:10,cid:0},
			items: [],
			listID:[],
			selectID:0,
			news:[],
			api:api,
			current: 0,
			status: 'more',
			isMore: true,
			projectList: [],
			contentText: {
			  	contentdown: '上拉加载更多',
			  	contentrefresh: '加载中',
			  	contentnomore: '没有更多'
			  }
		}
	},
	onLoad() {
		this.GetList()
	},
	onShareAppMessage: function () {
	
	},
	onReachBottom() {
		if (this.isMore) {
			this.status = 'more';
			this.parameter.page++;
			this.getData();
		}
	},
	onPullDownRefresh() {

	},
	methods: {
		Jump (url,record) {
			let path = url+'?id='+record.ID
			console.log('Jump',path)
			uni.navigateTo({
				url: path
			});
		},
		GetList(){
			this.$request.post(this.$api.ai.getContentClassList, {pid:23},'form').then(res => {
				if (res) {
					res.data.forEach(t=>{
						this.items.push(t.Name)
						this.listID.push(t.ID)
					})
					this.selectID = this.listID[0]
					this.getNews()
				}
				
			})
		},
		getNews(){
		this.parameter.cid = this.selectID
		this.$request.post(this.$api.ai.getContentList, this.parameter,'form').then(res => {
			if (res) {
				res.data.forEach(t=>{
					if(res.data.length > 0) {
					this.news = res.data
					} else {
						this.status = 'noMore';
						this.isMore = false;
					}
					
				})
			}
			
		})
		},
		onClickItem(e) {
						if (this.current !== e.currentIndex) {
							this.current = e.currentIndex
							this.parameter = {page:1,pagesize:10,cid:0}
							this.news = []
							this.selectID = this.listID[this.current]
							this.getNews()
						}
					},
	    search(e){
			   this.parameter.page = 1
			   this.projectList = []
			   this.getData();
		   },
		   OwnerShow(record){
			   this.$storage.setJson('project', record)
			   uni.switchTab({
			   	url:'/pages/owner/index'
			   })
			
		   },
		   getData:function(){
		   	this.status = 'loading';
		   	this.$request.postU(this.$api.project.list,this.parameter).then(res=>{
		   		if(res.data.length > 0) {
		   			
		   			this.projectList = this.projectList.concat(res.data)
		   			if(this.projectList.length < res.count) {
		   				this.status = 'more';
		   				this.isMore = true;
		   			} else {
		   				this.status = 'noMore';
		   				this.isMore = false;
		   			}
		   		} else {
		   			this.status = 'noMore';
		   			this.isMore = false;
		   		}
		   		
		   	});
		   }
		}
	}
</script>

<style>
 .content{
 }
 .subtxt{
	 color:#949494
 }
 .line{height: 1px;background: #5d5c5c;}
page {
	    background-color: #272727;
	}
 .list-left{
	 wdith:200px;
	 margin-left:10px;
	 text-align:left;
	 height: 70px;
 }
 .list-right{
 	 margin-left:10px;
	 text-align:left;
	 height: 70px;
 }
 .search-ico-wapper{
     background-color: #FFFFFF;
     display: flex;
     flex-direction:column;
     justify-content: center;
     padding: 0upx 0upx 0upx 40upx;
     border-bottom-left-radius:18px;
     border-top-left-radius: 18px;
 }
 .search-ico-wapper1{
     background-color: #FFFFFF;
     display: flex;
     flex-direction:column;
     justify-content: center;
     padding: 0upx 40upx 0upx 0upx;
     border-bottom-right-radius:18px;
     border-top-right-radius: 18px;
 }
 .shadow{
     width: 638upx;
     height: 60upx;
     border-radius:18px;
     -moz-box-shadow:0 0 10px #e6e6e6;
     -webkit-box-shadow:0 0 10px #e6e6e6;
     box-shadow:0 0 10px #e6e6e6;
     position: relative;
     top: -90upx;
     left: 60upx;
 }
 </style>